<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/resrt.css">
    <link rel="stylesheet" href="../iconfont/iconfont.css">
    <link rel="stylesheet" href="../css/list.css">
    <title>Document</title>
</head>

<body>
    <header class="header"></header>

    <!-- 立即登录板块 -->
    <div class="login-notic">
        <ul class="login_ready w">
            <li><a href="#">首页</a>&gt;</li>
            <li><a href="#">全部结果</a>&gt;</li>
            <li><a href="#">冰箱</a></li>
        </ul>
    </div>
    <!-- 分类板块 -->
    <div class="search_filter">
        <ul class="filter_wrap w">
            <span>分类：</span>
            <li><a href="#" class="orange">全部</a></li>
            <li><a href="#">冰箱</a></li>
            <li><a href="#">洗衣机</a></li>
            <li><a href="#">厨房用品</a></li>
        </ul>
    </div>

    <!-- 列表板块 -->
    <div class="search_result">
        <div class="reuslt_order w">
            <div class="order_list_box">
                <ul class="order_list">
                    <li><a href="#" class="orange">综合</a><span>|</span></li>
                    <li><a href="#">新品</a><span>|</span></li>
                    <li><a href="#">销量</a><span>|</span></li>
                    <li><a href="#">价格</a><span class="iconfont icon-direction-up"></span></li>
                </ul>

                <ul class="type_list">
                    <li class="data_v1">
                        <div class="address_choose">
                            <span>收货地</span>
                            <a href="#">北京 北京市</a>
                        </div>
                    </li>
                    <li class="data_v2">
                        <input type="checkbox" name="" id="">
                        <a href="#">促销</a>
                    </li>
                    <li class="data_v3">
                        <input type="checkbox" name="" id="">
                        <a href="#">分期</a>
                    </li>
                    <li class="data_v4">
                        <input type="checkbox" name="" id="">
                        <a href="#">仅看有货</a>
                    </li>
                </ul>
            </div>
            <!-- 商品列表开始 -->
            <ul class="data_list">


                <!-- <li class="goods_item card">
                    <a href="#">
                        <div class="figure_img">
                            <img src="../listimg/list01.jpg" alt="">
                        </div>
                        <h2>米家风冷十字四门冰箱 496L 灰色</h2>
                        <p class="list_price">
                            <span class="new_price">2899元</span>
                            <del>3699元</del>
                        </p>
                        <div class="thumbs">
                            <ul>
                                <li>
                                    <img src="../listimg/list01.jpg" alt="">
                                </li>
                            </ul>
                        </div>
                        <div class="flags">
                            <span class="fenqi">
                                <img src="../listimg/fenqi.png" alt="">
                            </span>
                            <span class="jiagou">
                                <img src="../listimg/jiagou.png" alt="">
                            </span>
                        </div>
                    </a>
                </li> -->

            </ul>

        </div>
    </div>

    <div class="footer"></div>
    <div class="aside"></div>

</body>

</html>
<script src="../js/jquery.js"></script>
<script>
    $(".header").load("../html/header.html")
    $(".footer").load("../html/footer.html")
    $(".aside").load("../html/aside.html")
    // 鼠标划过
    // let oGoodsItem = document.querySelector(".goods_item");
    // let oH2 = document.querySelector(".goods_item>a>h2")
    // oGoodsItem.onmouseover = function () {
    //     oH2.style.color = "#ff6700"
    // }



    getGoodsList();


    function getGoodsList() {
        $.get("../goodsAndShoppingCart/getGoodsList.php", { "typeId": "011" }, function (data) {
// console.log(data);
            let htmlStr = "";
            for (let i = 0; i < data.length; i++) {
                htmlStr += `<li class="goods_item card">
                    <a href="./detail.html?goodsId=${data[i].goodsId}" >
                    <a href="#">
                        <div class="figure_img">
                            <img src="${data[i].goodsImg}" alt="">
                        </div>
                        <h2>${data[i].goodsName}</h2>
                        <p class="list_price">
                            <span class="new_price">${data[i].goodsPrice}元</span>
                            <del>${data[i].beiyong1}元</del>
                        </p>
                        <div class="thumbs">
                            <ul>
                                <li>
                                    <img src="${data[i].beiyong2}" alt="">
                                </li>
                            </ul>
                        </div>
                        <div class="flags">
                            <span class="fenqi">
                                <img src="${data[i].beiyong3}" alt="">
                            </span>
                            <span class="jiagou">
                                <img src="${data[i].beiyong4}" alt="">
                            </span>
                        </div>
                    </a>
                </li> `
            }

            $(".data_list").html(htmlStr);
        }, "json");
    }
    
</script>
